import React, { useEffect, useState } from 'react'
import api from '@/api'
import {
    Space, Table, Tag, Image, Button, Drawer, message,
    Cascader,
    Checkbox,
    DatePicker,
    Form,
    Input,
    InputNumber,
    Radio,
    Select,
    Switch,
    TreeSelect,
    Upload,
    Pagination,
    Card,

} from 'antd';
import type { ColumnsType } from 'antd/es/table';
import { SearchOutlined, EditOutlined, CloseOutlined, PlusOutlined } from '@ant-design/icons';
const { TextArea } = Input;
const { RangePicker } = DatePicker;
export default function WorkerLeave() {
    const [list, setList] = useState([])
    async function getList() {
        const res = await api.worker.getOneLeaveList()
        setList(res.data.data)


    }
    useEffect(() => {
        getList()
    }, [])
    const columns: ColumnsType<any> = [
        {
            title: '请假理由',
            dataIndex: 'detail',
            key: 'detail'
        },
        {
            title: '开始时间',
            dataIndex: 'startTime',
            key: 'startTime'
        },
        {
            title: '结束时间',
            dataIndex: 'endTime',
            key: 'endTime',

        },
        {
            title: '状态',
            dataIndex: 'state',
            key: 'state',
            render: (_, item) => {
                let msg = ''
                if (item.look == 1) {
                    if (item.state == '0') {
                        msg = '驳回'
                    } else {
                        msg = '通过'
                    }
                } else {
                    msg = '待审核'
                }
                return (
                    <p>{msg}</p>
                )
            }

        },

    ]
    async function sumbit(args: any) {
        console.log(args.detail, args.time[0].$d);
        const res = await api.worker.workerLeave({ startTime: args.time[0].$d, endTime: args.time[1].$d, detail: args.detail })
        console.log(res);
        getList()


    }
    return (
        <div>
            <Card>
                <Table columns={columns} dataSource={list} pagination={false} />
                <Form
                    style={{ maxWidth: 600, marginTop: 50 }}
                    layout="horizontal"
                    onFinish={sumbit}
                >
                    <Form.Item label='请假原因' name='detail'>
                        <Input></Input>
                    </Form.Item>
                    <Form.Item label='选择请假时间' name='time'>
                        <RangePicker />
                    </Form.Item>
                    <Form.Item label=" ">
                        <Button type="primary" htmlType="submit" >
                            Submit
                        </Button>
                    </Form.Item>
                </Form>
            </Card>
        </div>
    )
}
